import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:terminal_flutter_demo/pages/getxpages/controllers/shop.dart';
import 'package:terminal_flutter_demo/pages/getxpages/controllers/user.dart';

class GetXShopPage extends StatefulWidget {
  const GetXShopPage({Key? key}) : super(key: key);

  @override
  _GetXShopPageState createState() => _GetXShopPageState();
}

class _GetXShopPageState extends State<GetXShopPage> {
  @override
  Widget build(BuildContext context) {
    // final UserController userController = Get.find<UserController>();
    final UserController userController = Get.find();

    // final ShopController shopController = Get.find<ShopController>();
    final ShopController shopController = Get.find();

    return Scaffold(
      appBar: AppBar(
        title: const Text('shop'),
      ),
      body: SizedBox(
        width: double.infinity,
        height: double.infinity,
        child: Column(
          children: [
            Text('arguments id: ${Get.arguments?['id']}'),
            const SizedBox(height: 30),
            Text('arguments token: ${userController.token}'),
            const SizedBox(height: 30),
            Text('UserController token: ${userController.user.value.token}'),
            const SizedBox(height: 30),
            ElevatedButton(
              onPressed: () {
                if (userController.token.isEmpty) {
                  Get.back();
                } else {
                  Get.offNamedUntil(
                    '/home',
                    (route) => false,
                    arguments: {'result': 666},
                  );
                }
              },
              child: const Text('返回'),
            ),
            ElevatedButton(
              onPressed: () {
                shopController.loadShopList();
              },
              child: const Text('获取数据'),
            ),
            Expanded(
              flex: 1,
              child: Obx(
                () => GridView.builder(
                    itemCount: shopController.shopList.length,
                    padding: const EdgeInsets.all(10),
                    gridDelegate:
                        const SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: 3, // x轴显示几个item
                      crossAxisSpacing: 10, // x轴间距
                      mainAxisSpacing: 10, // y轴间距
                      childAspectRatio: 1, // 宽/高比
                    ),
                    // gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent(
                    //   maxCrossAxisExtent: 120, // x轴子元素的最大宽度，如果宽度不够平分宽度，等宽显示item
                    //   crossAxisSpacing: 10, // x轴间距
                    //   mainAxisSpacing: 10, // y轴间距
                    //   childAspectRatio: 1, // 宽/高比
                    // ),
                    itemBuilder: (context, index) {
                      var item = shopController.shopList[index];
                      return Container(
                        decoration: const BoxDecoration(
                          color: Colors.blue,
                          borderRadius: BorderRadius.all(Radius.circular(12)),
                        ),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Image.network('${item['avatar_source']}'),
                            Text('${item['nickname']}')
                          ],
                        ),
                      );
                    }),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
